<template>
  <div class="content">
    <div class="data_content">
      <h4 class="f15">资料编辑</h4>
      <div class="data_list">
        <span class="data_left">姓名</span>
        <span class="data_right pr25">
          <el-input v-model="form.userName" placeholder="请输入内容"></el-input>
        </span>
        <div class="hr_bottom" style="width: calc(100% - 15px);"></div>
      </div>
      <div class="data_list">
        <span class="data_left">生日</span>
        <span class="data_right" style="margin-right:20px">
          <div class="block">
            <el-date-picker
              v-model="form.birthDay"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="选择日期">
            </el-date-picker>
          </div>
        </span>
        <div class="hr_bottom" style="width: calc(100% - 15px);"></div>
      </div>
      <div class="data_list">
        <span class="data_left">性别</span>
        <span class="data_right" style="margin-right:20px">
          <el-select v-model="form.userSex" placeholder="请选择">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </span>
      </div>
    </div>
    <div class="btn_content">
      <button class="button_confirm btn_green f18 mt35" @click="clickMe">确认修改</button>
    </div>
  </div>
</template>

<script>
  import {getInfo, update} from '@/api/userLogin'
  import {init} from '@/views/utils/common'

  export default {
    data() {
      return {
        form: {
          userId: '',
          userName: '',
          userSex: '',
          birthDay: '2019-01-01'
        },
        options: [{
          value: '0',
          label: '女'
        }, {
          value: '1',
          label: '男'
        }],
      }
    },
    mounted() {
      let that = this
      this.form.userId = localStorage.getItem("token")
      getInfo(this.form.userId).then((res) => {
        that.form.userName = res.userName
        that.form.userSex = res.userSex
        that.form.birthDay = res.birthDay
      })
    },
    methods: {

      clickMe() {

        update(this.form).then(() => {
          this.$message({
            title: '成功',
            message: '修改资料成功',
            type: 'success',
            duration: 1000,
            onClose() {
              location.reload()
            }
          })
        })

      },

    }
  }
</script>

<style scoped>
  @import "../../assets/css/iconfont.css";
  @import "../../assets/css/login_selfcenter.css";
  @import "../../assets/css/reset.css";
</style>
